<%@ page language="java" import="java.util.*" pageEncoding="utf-8" %>
<!DOCTYPE html>
<html>
<head>
    <jsp:include page="../common/top.jsp" flush="false"></jsp:include>
    <!--实名认证-->
</head>
<!-- 头部区域 -->
<body>
<div class="layui-layout layui-layout-admin">
    <jsp:include page="../common/header.jsp" flush="false"></jsp:include>
    <jsp:include page="../common/slideNav.jsp" flush="false"></jsp:include>
    <div class="layui-body">
        <div class="layadmin-tabsbody-item layui-show">
            <div class="layui-fluid">
                <div class="layui-card layui-form">
                    <div class="juzhong_box">
                        <div class="juzhong_box_tit">实名认证</div>
                        <div class=" layui-card-header layuiadmin-card-header-auto main_tool"
                             lay-filter="layadmin-userfront-formlist">
                            <div class="layui-form-item">

                                <div class="layui-show">
                                    <label class="layui-form-label">姓名</label>
                                    <div class="layui-input-block">
                                        <input type="text" name="xingming" placeholder="请输入姓名" autocomplete="off"
                                               class="layui-input">
                                    </div>
                                </div>
                                <div class="layui-show idcard_wrap">
                                    <label class="layui-form-label">身份证(人像面)</label>
                                    <div class="layui-upload-drag" id="test10">
                                        <i class="layui-icon"></i>
                                        <p>点击上传，或将文件拖拽到此处</p>
                                        <img id="shenfenzheng" class="idcard">
                                    </div>
                                </div>
                            </div>
                            <div class="layui-form-item">
                                <div class="layui-show">
                                    <label class="layui-form-label">身份证号</label>
                                    <div class="layui-input-block">
                                        <input type="text" name="idcard" placeholder="请输入" autocomplete="off"
                                               class="layui-input">
                                    </div>
                                </div>
                                <div class="layui-show idcard_wrap">
                                    <label class="layui-form-label">身份证(国徽面)</label>
                                    <div class="layui-upload-drag" id="test11">
                                        <i class="layui-icon"></i>
                                        <p>点击上传，或将文件拖拽到此处</p>
                                        <img id="shenfenzheng2" class="idcard">
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="btn_wrap">
                        <input type="button" lay-submit lay-filter="LAY-user-front-submit" value="通过" class="layui-btn">
                        <input  type="button" data-type="jujue" value="拒绝"
                               class="layui-btn layui-btn-danger layuiadmin-btn-useradmin">
                        <input data-type="fanhui" type="button" lay-filter="fanhui" value="返回"
                               class="layui-btn layui-btn-normal layuiadmin-btn-useradmin">
                    </div>
                </div>
            </div>
        </div>
    </div>
        <!--拒绝弹框-->
        <div id="jujuebox" class="layui-form hide_this layui-form-pane" lay-filter="layuiadmin-form-useradmin" style="padding: 20px 0 0 0;">
            <div class="layui-form-item layui-form-text">
                <label class="layui-form-label">拒绝理由</label>
                <div class="layui-input-block">
                    <textarea name="jujue_text" placeholder="请输入内容" class="layui-textarea"></textarea>
                </div>
            </div>
            <div class="btn_wrap">
                <input type="button" lay-submit lay-filter="LAY-user-front-submit" value="确认" class="layui-btn">
                <input onclick="layer.closeAll()" type="button"  lay-filter="back" value="返回" class="layui-btn">
            </div>
        </div>
    <script>
        $(function () {
            layui.use(['element', 'layer', 'form', 'layedit', 'laydate', 'table','upload'], function () {
                var element = layui.element, //导航的hover效果、二级菜单等功能，需要依赖element模块
                    layer = layui.layer, //弹窗模块
                    layedit = layui.layedit, //编辑器
                    laydate = layui.laydate, //日期选择器
                    form = layui.form, //表单
                    table = layui.table, //表格
                    upload = layui.upload;   //图片上传
                //用户管理
                //事件
                var active = {
                    jujue:function () {
                        layer.open({
                            type: 1,
                            title: '拒绝理由'
                            , area: ['650px', 'auto']
                            , closeBtn: 1
                            , skin: 'layui-layer-admin'
                            , content: $("#jujuebox")
                            , success: function (layero, index) {
                                form.render(null, 'layuiadmin-form-useradmin');
                                //监听提交
                                form.on('submit(LAY-user-front-submit)', function (data) {
                                    var field = data.field; //获取提交的字段
                                    //提交 Ajax 成功后，关闭当前弹层并重载表格
                                    layer.msg(JSON.stringify(data.field));
                                    //$.ajax({});
                                    layui.table.reload('account'); //重载表格
                                    layer.close(index); //执行关闭
                                });
                            }
                        })
                    },
                    fanhui:function () {
                        layer.msg("返回")
                    }
                };

                //监听提交
                form.on('submit(LAY-user-front-submit)', function (data) {
                    var field = data.field; //获取提交的字段
                    //提交 Ajax 成功后，关闭当前弹层并重载表格
                    layer.msg(JSON.stringify(data.field));
                    //$.ajax({});
                });
                //普通图片上传
                var uploadInst = upload.render({
                    elem: '#test10'
                    ,url: '/upload/'
                    ,before: function(obj){
                        //预读本地文件示例，不支持ie8
                        obj.preview(function(index, file, result){
                            $('#shenfenzheng').attr('src', result); //图片链接（base64）
                        });
                    }
                    ,done: function(res){
                        //如果上传失败
                        if(res.code > 0){
                            return layer.msg('上传失败');
                        }
                        //上传成功
                    }
                    ,error: function(){
                        //演示失败状态，并实现重传
                        var demoText = $('#demoText');
                        demoText.html('<span style="color: #FF5722;">上传失败</span> <a class="layui-btn layui-btn-xs demo-reload">重试</a>');
                        demoText.find('.demo-reload').on('click', function(){
                            uploadInst.upload();
                        });
                    }
                });
                var uploadInst2 = upload.render({
                    elem: '#test11'
                    ,url: '/upload/'
                    ,before: function(obj){
                        //预读本地文件示例，不支持ie8
                        obj.preview(function(index, file, result){
                            $('#shenfenzheng2').attr('src', result); //图片链接（base64）
                        });
                    }
                    ,done: function(res){
                        //如果上传失败
                        if(res.code > 0){
                            return layer.msg('上传失败');
                        }
                        //上传成功
                    }
                    ,error: function(){
                        //演示失败状态，并实现重传
                        var demoText = $('#demoText');
                        demoText.html('<span style="color: #FF5722;">上传失败</span> <a class="layui-btn layui-btn-xs demo-reload">重试</a>');
                        demoText.find('.demo-reload').on('click', function(){
                            uploadInst.upload();
                        });
                    }
                });
                /*绑定按钮事件 添加删除等功能按钮*/
                $('.layui-btn.layuiadmin-btn-useradmin').on('click', function () {
                    var type = $(this).data('type');
                    active[type] ? active[type].call(this) : '';
                });
            });
        })
    </script>

</body>

</html>